<template>
  <div>
    <!-- <PageWrapper>
      <template #headerContent> <WorkbenchHeader /> </template>
    </PageWrapper> -->
    <div class="mb-4 lg:flex justify-between" style="padding: 20px;background: #fff;font-size: 18px;border-radius: 10px;">
      <div>
        <Icon icon="simple-line-icons:settings" class="mr-1" />
        <span> 机床控制台   【<span style="color: red;">{{machineObj.name}}</span>】</span>
      </div>
      <div style="color: #aaa;">
        <Icon  icon="simple-line-icons:clock" class="mr-1" />
        <span> {{ currentDate }} </span>
      </div>
    </div>
     <div class="lg:flex">
      <div class="enter-y w-full !mr-4 lg:w-5/10">
        <div  class="mb-4">
          <Card title="基础信息" v-bind="$attrs">
            <div style="color: #aaa;">
              <div class="lg:flex justify-between mb-4">
                  <div>机床名称</div>
                  <div>{{machineObj.name}}</div>
              </div>
              <div class="lg:flex justify-between mb-4">
                  <div>当前工序</div>
                  <div>{{machineObj.task?.oper?.operName || ''}}</div>
              </div>
              <div class="lg:flex justify-between mb-4">
                  <div>图名</div>
                  <div>{{machineObj.task?.orderPic?.picname || ''}}</div>
              </div>
              <div class="lg:flex justify-between mb-4">
                  <div>图号</div>
                  <div>{{machineObj.task?.orderPic?.picno || ''}}</div>
              </div>
              <div class="lg:flex justify-between">
                  <div>机床状态</div>
                  <div>
                    <!-- :defaultValue="'2'" -->
                    <DictLabel
                      v-if="machineObj.machineStatus"
                      :dictType="'m8_machine_status'"
                      :dictValue="machineObj.machineStatus"
                    />
                  </div>
              </div>
            </div>
          </Card>
        </div>
        
        <div  class="mb-4">
          <Card title="机加操作" v-bind="$attrs">
            <div class="lg:flex mb-5" style="text-align: center;">
             
              <div @click="handleBarCode('图纸上机','shangJi')" class="lg:w-3/9" style="padding: 20px; border: #e4d6d6 solid 1px;border-radius: 8px;cursor:pointer;">
                <Icon  icon="ant-design:fund-projection-screen-outlined" class="mr-1"  color="green"/>
                图纸上机
              </div>
              
              <div @click="handleBarCode('图纸下机','xiaJi')" class="lg:w-3/9 mr-5 ml-5" style="padding: 20px; border: #e4d6d6 solid 1px;border-radius: 8px;cursor:pointer;">
                <Icon  icon="ant-design:desktop-outlined" class="mr-1" color="green" />
                图纸下机
              </div>

              <div @click="handleBarCode('调试登记','debug')" class="lg:w-3/9" style="padding: 20px; border: #e4d6d6 solid 1px;border-radius: 8px;cursor:pointer;">
                <Icon  icon="ant-design:bug-outlined" class="mr-1" color="green" />
                调试登记
              </div>
            </div>
            <div class="lg:flex mb-5" style="text-align: center;">
              <div @click="handleBarCode('开始加工','beginWork')" class="lg:w-3/9" style="padding: 20px; border: #e4d6d6 solid 1px;border-radius: 8px;cursor:pointer;">
                <Icon  icon="ant-design:poweroff-outlined" class="mr-1"  color="green"/>
                开始加工
              </div>
              <div @click="handleBarCode('结束加工','endWork')" class="lg:w-3/9 mr-5 ml-5" style="padding: 20px; border: #e4d6d6 solid 1px;border-radius: 8px;cursor:pointer;">
                <Icon  icon="ant-design:play-square-outlined" class="mr-1" color="green" />
                结束加工
              </div>
               <div class="lg:w-3/9" style="padding: 20px; ">
              </div>
            </div>
          </Card>
        </div>

        <div  class="mb-4">
          <Card title="检验操作" v-bind="$attrs">
            <div class="lg:flex mb-5" style="text-align: center;">
              <div @click="orderCheckList(machineObj.task?.taskCode)" class="lg:w-3/9" style="padding: 20px; border: #e4d6d6 solid 1px;border-radius: 8px;cursor:pointer;">
                <Icon  icon="simple-line-icons:eye" class="mr-1"  color="orange"/>
                检验明细
              </div>
              <div @click="handleBsj(machineObj)" class="lg:w-3/9 mr-5 ml-5" style="border: #e4d6d6 solid 1px;padding: 20px; border-radius: 8px;cursor:pointer;">
                <Icon  icon="ant-design:fast-forward-filled" class="mr-1" color="orange" />
                首检提示
              </div>
              <div @click="addCheckData(machineObj, 1)" class="lg:w-3/9 mr-5 ml-5" style="border: #e4d6d6 solid 1px;padding: 20px; border-radius: 8px;cursor:pointer;">
                <Icon  icon="ant-design:fast-forward-filled" class="mr-1" color="orange" />
                首检
              </div>
              <div @click="addCheckData(machineObj, 2)" class="lg:w-3/9 mr-5 ml-5" style="border: #e4d6d6 solid 1px;padding: 20px; border-radius: 8px;cursor:pointer;">
                <Icon  icon="ant-design:fast-forward-filled" class="mr-1" color="orange" />
                巡检
              </div>
              <div class="lg:w-3/9" style="padding: 20px; ">
              </div>
            </div>

          </Card>
        </div>
      </div>
        
      <div class="enter-y w-full lg:w-5/10">
        <div  class="mb-4">
          <Card title="操作控制" v-bind="$attrs">
            <div class="lg:flex mb-5" style="font-size: 22px;">
              <a-popconfirm
                  title="是否确认开机？"
                  ok-text="是"
                  cancel-text="否"
                  @confirm="machineEnable(machineObj.code, '0')"
                >
                  <div class="flex-1 mr-5" style="cursor:pointer;background: rgb(65, 179, 65);padding: 20px;border-radius: 10px;color: #fff;text-align: center;">
                    <!-- :style="{ color: 'orange' }" -->
                    <Icon  icon="ant-design:poweroff-outlined" class="mr-1"  />
                    开机
                  </div>
              </a-popconfirm>
               <a-popconfirm
                  title="是否确认停机？"
                  ok-text="是"
                  cancel-text="否"
                  @confirm="machineEnable(machineObj.code, '1')"
                >
                  <div class="flex-1" style="cursor:pointer;background: rgb(245, 23, 23);padding: 20px;border-radius: 10px;color: #fff;text-align: center;">
                    <Icon  icon="ant-design:play-square-outlined" class="mr-1" />
                    停机
                  </div>
                </a-popconfirm>
            </div>
            <div @click="handleBC(machineObj)" style="font-size: 22px;cursor:pointer;background: rgb(93, 84, 154);padding: 20px;border-radius: 10px;color: #fff;text-align: center;">
              <Icon icon="ant-design:warning-filled" />
              BC反馈
            </div>
          </Card>
        </div>
        <div  class="mb-4">
          <Card title="加工操作" v-bind="$attrs">
            <div class="lg:flex mb-5" style="text-align: center;">
              <div @click="openTaskList(machineObj.task?.taskCode)" class="lg:w-3/9" style=" border: #e4d6d6 solid 1px; padding: 20px; border-radius: 8px;cursor:pointer;">
                <Icon  icon="simple-line-icons:clock" class="mr-1"  color="#0501ff" />
                修改加工时长
              </div>
              <div @click="handleRouterList(machineObj.task?.orderPic?.id)" class="lg:w-3/9 mr-5 ml-5" style="border: #e4d6d6 solid 1px;padding: 20px; border-radius: 8px;cursor:pointer;">
                <Icon  icon="simple-line-icons:eye" class="mr-1" color="#0501ff" />
                数铣配置
              </div>
               <div class="lg:w-3/9" style="padding: 20px; ">
              </div>
            </div>
          </Card>
        </div>
        <div  class="mb-4">
          <Card title="其它操作" v-bind="$attrs">
             <div class="lg:flex mb-5" style="text-align: center;">
              <div @click="addRemark(machineObj)" class="lg:w-3/9" style="padding: 20px; border: #e4d6d6 solid 1px;border-radius: 8px;cursor:pointer;">
                <Icon  icon="simple-line-icons:pencil" class="mr-1"  color="#00c0ef"/>
                加工备注
              </div>
              <div @click="remarksPush(machineObj)" class="lg:w-3/9 mr-5 ml-5" style="padding: 20px; border: #e4d6d6 solid 1px;border-radius: 8px;cursor:pointer;">
                <Icon  icon="simple-line-icons:eye" class="mr-1" color="#00c0ef" />
                查看备注
              </div>
              <div @click="openPool(machineObj)" class="lg:w-3/9" style="padding: 20px; border: #e4d6d6 solid 1px;border-radius: 8px;cursor:pointer;">
                <Icon  icon="simple-line-icons:eye" class="mr-1" color="#00c0ef" />
                任务队列
              </div>
            </div>
          </Card>
        </div>
        
      </div>
    </div>

    <!-- 编程反馈 -->
    <BCDrawerForm @register="registerBCDrawer" @success="handleSuccess" />
    <RemarkFormTabs @register="registerRemarkDrawer" />
    <PoolList @register="registerPoolDrawer" />
    <CheckTipModal @register="checkTipRegister" @success="handleSuccess" />
    <OperCheck @register="registerCheckForm" @success="handleSuccess" />

    <BasicDrawer
      v-bind="$attrs"
      @register="registerTaskDrawer"
      :showFooter="false"
      width="80%"
      title="任务明细"
    >
      <TaskList :taskCode="taskCode" />
    </BasicDrawer>

     <BasicDrawer
      v-bind="$attrs"
      @register="registerSxDrawer"
      :showFooter="false"
      width="80%"
      title="数铣明细"
    >
      <SxList :orderPic="orderPic" />
    </BasicDrawer>

    <!-- 图纸备注 -->
    <BasicDrawer
      v-bind="$attrs"
      @register="registerRemarksDrawer"
      :showFooter="false"
      width="80%"
      :maskClosable="true"
      title="图纸备注"
    >
      <Remarks :picId="picId" />
    </BasicDrawer>

    <BasicDrawer
      v-bind="$attrs"
      @register="registerCheckDrawer"
      :showFooter="false"
      width="80%"
      title="检验明细"
    >
      <CheckList :taskCode="taskCode" />
    </BasicDrawer>

    <barcodeModal @register="registerImportModal" @success="handleSuccess" />
  </div>
</template>
<script lang="ts" setup name="ViewsM8MachineMachineList">
  import { ref,onMounted } from 'vue';
  import { useMessage } from '/@/hooks/web/useMessage';
  import { usePermission } from '/@/hooks/web/usePermission';
  import { Card } from 'ant-design-vue';
  import { PageWrapper } from '/@/components/Page';
  import { DictLabel } from '/@/components/Dict';
  import { Icon } from '/@/components/Icon';
  import { router } from '/@/router';
  import { machineListData,disable,enable } from '/@/api/m8/machine/machine';
   import { useDrawer } from '/@/components/Drawer';
   import { BasicDrawer } from '/@/components/Drawer';
  import BCDrawerForm from '/@/views/m8/order/flow/bc/BCDrawerForm.vue';
  import TaskList from '../task/list.vue';
  import SxList from '../../order/sx/list.vue';
  import RemarkFormTabs from '../task/remark/formTabs.vue';
  import Remarks from '/@/views/m8/order/remarks.vue';
  import PoolList from '../task/poolList.vue';
  import CheckList from '../../order/flow/check/list.vue';
  import CheckTipModal from './checkTipModal.vue';
  import { useModal } from '/@/components/Modal';
  import OperCheck from '/@/views/m8/machine/check/form.vue';
  import barcodeModal from './barcodeModal.vue';

  const { showMessage } = useMessage();
  const { hasPermission } = usePermission();

   // 获取当前的年月日时分秒
  const date = new Date();
  const year = date.getFullYear();
  const month = date.getMonth() + 1;
  const day = date.getDate();
  const hours = date.getHours();
  const minutes = date.getMinutes();
  const seconds = date.getSeconds();
  // console.log(year, month, day);
  const currentDate = year + '-' + month + '-' + day + ' ' + hours + ':' + minutes;
  let machineObj = ref({});
  let taskCode = ref('');
  let orderPic = ref('');
  let picId = ref('');

  const [registerBCDrawer, { openDrawer: openBCDrawer }] = useDrawer();
  const [registerTaskDrawer, { openDrawer: openTaskDrawer }] = useDrawer();
  const [registerSxDrawer, { openDrawer: openSxDrawer }] = useDrawer();
  const [registerRemarkDrawer, { openDrawer: openRemarkDrawer }] = useDrawer();
  const [registerRemarksDrawer, { openDrawer: openRemarkskDrawer }] = useDrawer();
  const [registerPoolDrawer, { openDrawer: openPoolDrawer }] = useDrawer();
  const [registerCheckDrawer, { openDrawer: openCheckDrawer }] = useDrawer();
  const [checkTipRegister, { openModal: openCheckTipModal }] = useModal();
  const [registerCheckForm, { openDrawer: openCheckForm }] = useDrawer();
  const [registerImportModal, { openModal: importModal }] = useModal();

  onMounted(async() => {
    handleSuccess()
  });

  async function handleSuccess(){
    let res = await machineListData(router.currentRoute.value.query)
    machineObj.value = res.list[0]
  }

   async function machineEnable(code, type) {
    let res = {
      message: '',
    };
    let data = {
      code,
      eventCode: type,
    };
    if (type == '0') {
      res = await disable(data);
    } else {
      res = await enable(data);
    }
    showMessage(res.message);
    handleSuccess();
  }

  // 编程反馈
  const handleBC = (record) => {
    openBCDrawer(true, record);
  };

  function openTaskList(record) {
    taskCode.value = record;
    openTaskDrawer();
  }

  function handleRouterList(record) {
    orderPic.value = record;
    openSxDrawer();
  }

   function addRemark(record: Recordable) {
    if (record.task) {
      openRemarkDrawer(true, {
        taskCode: record.task.taskCode,
        operCode: record.task.oper.operCode,
        machineId: record.code,
      });
    } else {
      showMessage('当前机床无任务加工！');
    }
  }

   async function remarksPush(record) {
    if (record.task) {
      picId.value = record.task.orderPic.id;
      openRemarkskDrawer(true);
    } else {
      showMessage('当前机床无备注！');
    }
  }

  async function openPool(record: Recordable) {
    openPoolDrawer(true, {
      title:
        '机床-' +
        record.name +
        '【' +
        (record.operNames ? record.operNames.replaceAll(',', '-') : '') +
        '】',
      machine: record.code,
      orderPic: record.task && record.task.orderPic,
      taskCode: record.task && record.task.taskCode,
      openType: '2',
    });
  }

  function orderCheckList(record) {
    taskCode.value = record;
    openCheckDrawer(true);
  }

  // 首检提示
  async function handleBsj(record: Recordable) {
    if (record.task) {
      openCheckTipModal(true, { ...record });
    } else {
      showMessage('任务信息缺失，请刷新后重试！');
    }
  }

  function addCheckData(record, checkType) {
    let obj = {
      'task.taskCode': record.task.taskCode,
      machineId: record.code,
      checkType: checkType,
    };
    openCheckForm(true, obj);
  }



  function handleBarCode(title,funcType) {
    importModal(true, { title, funcType, machineId:machineObj.value.id });
  }

</script>
